<!DOCTYPE html>
<html>
<head>
    <title>房源预选主界面</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/style/admin.css" media="all">
    <link rel="stylesheet" href="/style/jmdf.css" media="all">
    <style>
        .footer {
            color: inherit;
            border: 1px solid #e7eaec;
            background: #f5f5f6;
            padding: 5px;
            width: 100%;
            position: fixed;
            bottom: 0px;
            text-align: center;
        }
    </style>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <#setting number_format="#.##">
</head>
<body>
<div class="layui-fluid">
    <form class="layui-form">
        <div class="layui-card">
            <div class="layui-card-header">一、被征收人基本信息</div>
            <div class="layui-card-body">
                <div class="layui-form-item">
                    <div class="layui-col-xs12">
                        征收项目：${(contract.zsProject.projectName)!}
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-col-xs12">
                        协议编号：${(contract.contractCode)!}
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-col-xs12">
                        选房顺序号：${(contract.chooseHouseNum)!}
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-col-xs12">
                        被征收人：${(contract.name)!}
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-col-xs12">
                        身份证号：${(contract.idCard)!}
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-col-xs12">
                        总可选房面积：【<span class="jmdf-color-red">${(contract.limitHouseAreaTotal)!}</span>】㎡
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-card">
            <div class="layui-card-header">二、预定户型</div>
            <div class="layui-card-body">
                <#if contract.carLotYxZhNum?? && contract.carLotYxZhNum gt 0>
                    <div class="layui-form-item">
                        <div class="layui-col-xs2">
                            置换车位：${(contract.carLotYxZhNum)!}<span class="jmdf-color-red">个</span>
                        </div>
                    </div>
                </#if>
                <#if contract.house60YxNum?? && contract.house60YxNum gt 0>
                    <div class="layui-form-item">
                        <div class="layui-col-xs2">
                            60型：${(contract.house60YxNum)!}<span class="jmdf-color-red">套</span>
                        </div>
                    </div>
                </#if>
                <#if contract.house80YxNum?? && contract.house80YxNum gt 0>
                    <div class="layui-form-item">
                        <div class="layui-col-xs2">
                            80型：${(contract.house80YxNum)!}<span class="jmdf-color-red">套</span>
                        </div>
                    </div>
                </#if>
                <#if contract.house100YxNum?? && contract.house100YxNum gt 0>
                    <div class="layui-form-item">
                        <div class="layui-col-xs2">
                            100型：${(contract.house100YxNum)!}<span class="jmdf-color-red">套</span>
                        </div>
                    </div>
                </#if>
                <#if contract.house120YxNum?? && contract.house120YxNum gt 0>
                    <div class="layui-form-item">
                        <div class="layui-col-xs2">
                            120型：${(contract.house120YxNum)!}<span class="jmdf-color-red">套</span>
                        </div>
                    </div>
                </#if>
                <#if contract.house140YxNum?? && contract.house140YxNum gt 0>
                    <div class="layui-form-item">
                        <div class="layui-col-xs2">
                            140型：${(contract.house140YxNum)!}<span class="jmdf-color-red">套</span>
                        </div>
                    </div>
                </#if>
                <#if contract.house160YxNum?? && contract.house160YxNum gt 0>
                    <div class="layui-form-item">
                        <div class="layui-col-xs2">
                            160型：${(contract.house160YxNum)!}<span class="jmdf-color-red">套</span>
                        </div>
                    </div>
                </#if>
                <#if contract.house180YxNum?? && contract.house180YxNum gt 0>
                    <div class="layui-form-item">
                        <div class="layui-col-xs2">
                            180型：${(contract.house180YxNum)!}<span class="jmdf-color-red">套</span>
                        </div>
                    </div>
                </#if>
                <#if contract.houseFsOneYxNum?? && contract.houseFsOneYxNum gt 0>
                    <div class="layui-form-item">
                        <div class="layui-col-xs2">
                            复式1型：${(contract.houseFsOneYxNum)!}<span class="jmdf-color-red">套</span>
                        </div>
                    </div>
                </#if>
                <#if contract.houseFsTwoYxNum?? && contract.houseFsTwoYxNum gt 0>
                    <div class="layui-form-item">
                        <div class="layui-col-xs2">
                            复式2型：${(contract.houseFsTwoYxNum)!}<span class="jmdf-color-red">套</span>
                        </div>
                    </div>
                </#if>
            </div>
        </div>
        <div class="layui-card">
            <div class="layui-card-header">三、请选择安置项目及房源<span style="color: red">【预选】</span></div>
            <div class="layui-card-body">
                <div class="layui-form-item">
                    <div class="layui-col-xs12">
                        <#if (azProjectIdList?size > 0)>
                            <#list azProjectIdList as azProjectId>
                                <#assign azProject=azProjectMap[azProjectId?c]/>
                                <a class="layui-btn loadAzProject" azProjectId="${(azProject.id)!}"><i
                                            class="layui-icon layui-icon-home"></i>${(azProject.projectName)!}</a>
                            </#list>
                        </#if>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-card">
            <div class="layui-card-header">
                四、预选房源列表
            </div>
            <div class="layui-card-body">
                <table class="layui-table" lay-filter="layFilter" id="yxHouseTable"></table>
            </div>
        </div>
        <div class="layui-card">
            <div class="layui-card-header">
                五、预选车位列表<button type="button" class="layui-btn carLotAdd">预选车位</button>
            </div>
            <div class="layui-card-body">
                <table class="layui-table" lay-filter="layFilter" id="yxCarLotTable"></table>
            </div>
        </div>
    </form>
</div>
<#--预选房源信息展示-->
<script type="text/html" id="indexTpl">
    {{d.LAY_TABLE_INDEX+1}}
</script>
<!--菜单-->
<script type="text/html" id="yxHouseTable_toolbar">
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="yxHouseTable_delete"><i
                class="layui-icon layui-icon-delete"></i>撤销</a>
</script>
<!--菜单-->
<script type="text/html" id="yxHouseTable_toolbar">

    <#--预选车位信息展示-->
    <script type="text/html" id="indexTplCarLot">
        {{d.LAY_TABLE_INDEX+1}}
</script>
<!--菜单-->
<script type="text/html" id="yxCarLotTable_toolbar">
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="yxCarLotTable_delete"><i
                class="layui-icon layui-icon-delete"></i>撤销</a>
</script>
<!--菜单-->
<script type="text/html" id="yxCarLotTable_toolbar">



</script>
<script src="/layui/layui.js" charset="utf-8"></script>
<script>
    layui.config({
        base: '/modules/' //静态资源所在路径
    }).use(['jquery', 'jmdf', 'form', 'table'], function () {
        var $ = layui.jquery, jmdf = layui.jmdf, form = layui.form, table = layui.table,
            parentIndex = parent.layer.getFrameIndex(window.name);

        $(".loadAzProject").click(function () {
            var obj = $(this);
            jmdf.view("housePicture?contractId=${(contract.id)!}&azProjectId=" + obj.attr("azProjectId"), "90");
            $(".loadAzProject").removeClass("layui-btn-danger");
            obj.addClass("layui-btn-danger")
        });

        //预选房源信息列表
        var cols = [[
            {title: "序号", toolbar: '#indexTpl', type: "numbers", fixed: 'left', align: 'center'}
            , {field: "houseInfo", title: "房屋信息", align: 'center'}
            , {title: '操作', fixed: 'right', align: 'center', toolbar: '#yxHouseTable_toolbar', width: 100}
        ]];

        //加载预选房源列表
        var options = {
            elem: '#yxHouseTable' //table列表id值
            , url: "loadYxHouseInfo?contractId=${(contract.id)!}"
            <#--, url: "loadYxHouseInfo?contractId=${(encodedContractId)!}"-->
            , cols: cols
            , id: "renderId"
        };
        table.render(options);

        //预选车位信息列表
        var colsCarLot = [[
            {title: "序号", toolbar: '#indexTplCarLot', type: "numbers", fixed: 'left', align: 'center'}
            , {field: "carLotInfo", title: "车位信息", align: 'center'}
            , {title: '操作', fixed: 'right', align: 'center', toolbar: '#yxCarLotTable_toolbar', width: 100}
        ]];
        //加载预选房源列表
        var options = {
            elem: '#yxCarLotTable' //table列表id值
            , url: "loadYxCarLotInfo?contractId=${(contract.id)!}"
            <#--, url: "loadYxCarLotInfo?contractId=${(encodedContractId)!}"-->
            , cols: colsCarLot
            , id: "renderCarLotId"
        };
        table.render(options);

        //撤销预选信息列表
        table.on("tool(layFilter)", function (obj) {
            var data = obj.data;///获得当前行数据
            var layEvent = obj.event;//获得lay-event对应的值
            var id = data["id"];
            if (layEvent == "yxHouseTable_delete") {
                layer.open({
                    title: false,
                    shade: 0.5,
                    content: "确定要撤销" + data['houseInfo'] + "预选房源吗？",
                    btn: ['确定', '取消'],
                    closeBtn: 0,
                    btnAlign: 'c'
                    ,
                    yes: function (index) {
                        $.get("yxHouseDelete", {houseId: data["id"],contractId: data["contractId"], _time: new Date().getTime()}, function (data) {
                            if (data.code == "0001") {//成功
                                layer.msg(data.message, {anim: 0, icon: 1, time: 1000}, function () {
                                    reloadSelectYxHouseInfo();
                                });
                            } else {//失败
                                layer.msg(data.message, {anim: 6, icon: 2, time: 3000});
                            }
                            layer.close(index);
                        });
                    }
                });
            } else if (layEvent == "yxCarLotTable_delete") {
                layer.open({
                    title: false,
                    shade: 0.5,
                    content: "确定要撤销" + data['carLotInfo'] + "预选车位吗？",
                    btn: ['确定', '取消'],
                    closeBtn: 0,
                    btnAlign: 'c'
                    ,
                    yes: function (index) {
                        $.get("yxCarLotDelete", {carLotId: data["id"],contractId: data["contractId"], _time: new Date().getTime()}, function (data) {
                            if (data.code == "0001") {//成功
                                layer.msg(data.message, {anim: 0, icon: 1, time: 1000}, function () {
                                    reloadSelectYxCarLotInfo();
                                });
                            } else {//失败
                                layer.msg(data.message, {anim: 6, icon: 2, time: 3000});
                            }
                            layer.close(index);
                        });
                    }
                });
            }
        });

        function reloadSelectYxHouseInfo() {
            table.reload("renderId", {});
        };

        function reloadSelectYxCarLotInfo() {
            table.reload("renderCarLotId", {});
        };

        window.reloadSelectYxHouseInfo = reloadSelectYxHouseInfo;
        window.reloadSelectYxCarLotInfo = reloadSelectYxCarLotInfo;

        /******************车位预选添加*********************/
        $(".carLotAdd").click(function () {
            jmdf.view("carLotList?contractId=${(contract.id)!}", "80");
        });


        form.render();
    });
</script>
</body>
</html>